<template>
	<div class="p_Login">
		<div class="p_Login_Return">
			<a href="javascript:history.back(-1)">
				<img src="../../assets/login/返回.png" />
			</a>
		</div>
			
		<a class="p_Login_logo" href="#">
			<img src="https://misc.gomein.net.cn/plus/images/u/login/logo_xh.png?v=2017092001" alt="" />
		</a>
		<ul class="p_Login_mesg">
			<li class="p_Login_mesg1">
				<a href="#/userzhuce">账号密码登录</a>
			</li>
			<li class="p_Login_mesg2">
				<a href="#/zhanghao">短信验证码登录</a>
			</li>
		</ul>
		<router-view name="second"></router-view>
		<!--公共部分-->
		<div class="p_Login_gonggong">
			<span class="line"></span>
			<span class="txt">使用以下账户登录</span>
			<span class="line"></span>
			<div class="p_Login_qq">
				<a href="#"><img src="https://misc.gomein.net.cn/plus/images/u/login_new/mdhy.png"/></a>
				<a href="#"><img src="https://misc.gomein.net.cn/plus/images/u/login_new/QQ.png"/></a>
				<a href="#"><img src="https://misc.gomein.net.cn/plus/images/u/login_new/weibo.png"/></a>
				<a href="#"><img src="https://misc.gomein.net.cn/plus/images/u/login_new/zfb.png"/></a>
			</div>

		</div>
	</div>
</template>

<script>
	
	export default {
		name: 'yanzheng',
		data() {
				return {
		
				}
			},
	methods: {

	},
	mounted() {
		$(function() {
			$(".p_Login_mesg1 a").click(function() {
				$(".p_Login_mesg1 ").css("border-bottom", "2px solid #F20C59")
				$(".p_Login_mesg2 ").css("border-bottom", "none")
			});
			$(".p_Login_mesg2 a").click(function() {
				$(".p_Login_mesg1 ").css("border-bottom", "none")
				$(".p_Login_mesg2 ").css("border-bottom", "2px solid #F20C59")
			});
			//返回上一页
			$(".p_Login_Return img").click(function() {
			});
		})
	}
}
</script>

<style scoped>
	
	.p_Login_Return img {
		width: 10%;
		margin: 2%;
	}
	
	.p_Login_logo {
		display: block;
		text-align: center;
	}
	
	.p_Login_logo img {
		width: 38%;
	}
	
	.p_Login_mesg {
		width: 80%;
		margin: auto;
		margin-top: 5%;
		text-align: center;
		display: flex;
		justify-content: space-between;
	}
	
	.p_Login_mesg li {
		display: inline-block;
		font-size: 0.8rem;
		color: #999;
		width: 48%;
		padding: 5%;
	}
	
	.p_Login_mesg1 {
		border-bottom: 2px solid #F20C59;
	}
	
	.p_Login_mesg2 {
		border-bottom: 2px solid #F20C59;
		border-bottom: none;
	}
	
	.p_Login_mesg1 a {
		text-decoration: none;
	}
	
	.p_Login_mesg2 a {
		text-decoration: none;
	}
	/*公共部分*/
	
 .p_Login_gonggong {
   height: 60px;
   line-height: 60px;
   text-align: center;
   width: 80%;
   margin: auto;
}
  .line {
   display: inline-block;
   width: 28%;
   border-top: 1px solid #ccc ;
}
 .txt {
   color: #686868;
   vertical-align: middle;
   font-size: 0.65rem;
   vertical-align: auto;
   }
   .p_Login_qq img{
   	width: 60%;
   	height: 60%;
   }
.p_Login_qq{
	display: flex;
	justify-content: space-around;
}
</style>